<template>
  <div>
    <a-radio-group @change="handleButtonChange">
      <a-radio-button value="all">
        全部
      </a-radio-button>
      <a-radio-button value="onSale">
        售卖中
      </a-radio-button>
      <a-radio-button value="offSale">
        已下架
      </a-radio-button>
      <a-radio-button value="disSale">
        封禁中
      </a-radio-button>
    </a-radio-group>

    <ManageProductOnlineAll v-if="productStatus == 'all'"/>
    <ManageProductOnlineOnSale v-if="productStatus == 'onSale'"/>
    <ManageProductOnlineOffSale v-if="productStatus == 'offSale'"/>
    <ManageProductOnlineDisSale v-if="productStatus == 'disSale'"/>
  </div>
</template>

<script>
  import ManageProductOnlineAll from '@/views/tmall/product/manageProductOnlineAll'
  import ManageProductOnlineOnSale from '@/views/tmall/product/manageProductOnlineOnSale'
  import ManageProductOnlineOffSale from '@/views/tmall/product/manageProductOnlineOffSale'
  import ManageProductOnlineDisSale from '@/views/tmall/product/manageProductOnlineDisSale'

  export default {
    name: 'ManageProductOnline',
    components: {
      ManageProductOnlineAll,
      ManageProductOnlineOnSale,
      ManageProductOnlineOffSale,
      ManageProductOnlineDisSale
    },
    data () {
      return {
        productStatus: 'all'
      }
    },
    methods: {
      handleButtonChange (e) {
        this.productStatus = e.target.value
      }
    }
  }
</script>

<style scoped>

</style>
